﻿@using SharedRes = ViewRes.SharedStrings;
@using Res = ViewRes.Search.IndexStrings;

<div data-bind="visible: showTagSearch, with: tagSearchViewModel">

	@{ Html.RenderPartial("Partials/_EntryCountBox"); }


	<div data-bind="with: paging">
		@KnockoutHelpers.ServerSidePaging()
	</div>

	<table class="table table-striped" data-bind="css: { loading: loading }">
		<thead>
			<tr>
				<th colspan="2">
					<a data-bind="click: function() { sort('Name') }" href="#">
						@SharedRes.Name
						<span class="sortDirection_down" data-bind="visible: sort() == 'Name'"></span>
					</a>
				</th>
				<th>
					@Res.Category
				</th>
				<th>
					<a data-bind="click: function() { sort('UsageCount') }" href="#">
						@Res.TagUsages
						<span class="sortDirection_down" data-bind="visible: sort() == 'UsageCount'"></span>
					</a>
				</th>
			</tr>
		</thead>
		<tbody data-bind="foreach: page">
			<tr>
				<td style="width: 80px">
					<a data-bind="visible: $data.mainPicture && mainPicture.urlSmallThumb, attr: { href: vdb.utils.EntryUrlMapper.details_tag(id, urlSlug), title: $data.additionalNames }" href="#">
						<img data-bind="attr: { src: ($data.mainPicture ? mainPicture.urlSmallThumb : '') }" title="Cover picture" class="coverPicThumb img-rounded" />
					</a>
				</td>
				<td>
					<a data-bind="text: name, attr: { href: vdb.utils.EntryUrlMapper.details_tag(id, urlSlug) }" href="#"></a>
					@KnockoutHelpers.DraftIcon("status")
					<br />
					<small class="extraInfo" data-bind="text: $data.additionalNames"></small>
				</td>
				<td>
					<p data-bind="text: categoryName"></p>
				</td>
				<td>
					<p data-bind="text: usageCount"></p>
				</td>
			</tr>
		</tbody>
	</table>

	<div data-bind="with: paging">
		@KnockoutHelpers.ServerSidePaging()
	</div>

</div>

